var props = 'transform WebkitTransform MozTransform OTransform msTransform'.split(' '),
prop,
el = document.createElement('div');

for(var i = 0, l = props.length; i < l; i++) {
    if(typeof el.style[props[i]] !== "undefined") {
        prop = props[i];
        break;
    }
}

var xAngle = 0, yAngle = 0;
$('body').keydown(function(evt) {
    remove_class(); 
    
    switch(evt.keyCode) {
        case 37: // left
            yAngle -= 90;
            break;

        case 38: // up
            xAngle += 90;
            break;

        case 39: // right
            yAngle += 90;
            break;

        case 40: // down
            xAngle -= 90;
            break;
            
        case 32: //space
            change_class();
            break;
            
        case 13: //enter
            
            change_class();
            alert ('changement de playlist');
            break;
           
    };
    
    document.getElementById('cube').style[prop] = "rotateX("+xAngle+"deg) rotateY("+yAngle+"deg)";
}); 


function remove_class() {  // permet de passer du control du cube par clavier à l'animation
    
    var bouge = document.getElementById('cube');
    bouge.className= ""; 
                
} 

function change_class() {  // permet de passer de l'animation au control du cube par clavier
    
    var bouge = document.getElementById('cube');
    bouge.className= "animate"; 
                
} 

function hide_cube(currentpage) {
    $('#menu_link').text('Cube');
    $("#menu_link").attr("onClick","show_cube(currentpage)");

    currentpage1 = currentpage;
    current_page = 'main';
    if(current_page == 'main')
    {
        $("#main").css('display', 'none'); 
        //               $("#volet").toggle();
        $(".sc-player playing").css('display', 'none');  
        $(".playlist1").css('display', 'none');   
        $(".playlist2").css('display', 'none');   
        $(".playlist3").css('display', 'none');   
        $(".playlist4").css('display', 'none');   
        $(".playlist5").css('display', 'none');   
        $(".playlist6").css('display', 'none'); 
        //               $("#volet").toggle();
        $("#volet").removeClass('volet');
        $("#archive_title").css('display', 'block');


        current_page = 'archive';
    }

}

function show_cube(currentpage1){
    $('#menu_link').text('Archive');
    $("#menu_link").attr("onClick","hide_cube(currentpage)");
    $("#volet").addClass('volet');

    $('.'+currentpage1).css('display', 'block');   
  
    $("#archive_title").css('display', 'none');

    $("#main").css('display', 'block'); 

    current_page = 'main';
        
}


function change_perspective() { //permet entrer dans le cube
    
    var perspective = document.getElementById('link_room');
    perspective.element.style.width = '150px';
                
} 


